﻿@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_LayoutFront.cshtml";
}

<style>
    .article-content article p {
        display: none;
    }

        .article-content article p:nth-child(1) {
            display: block;
        }
</style>
<style>
    .header-nav {
        background-color: #b9abce;
    }

    body {
        color: black;
    }
    .article-content>div {
    margin-left: 400px;
}
</style>

<div>
    <header class="header-article-list">
        <ul>
            @foreach (var item in ViewBag.A)
            {
                <li><a href="/News/Index/@item.Id">@item.Name</a></li>
            }
        </ul>
        <div class="article-more-btn">
            <a href="/NewsDetail/More">❤MORE &#62; &#62;</a>
        </div>
    </header>

    <section class="article-content">
        <input type="hidden" id="typeId" value="@ViewBag.B" />
        <ul id="main_list">
            @*@foreach (var item in ViewBag.A)
                {

                    <li>
                        <div class="article-date">
                            <strong>@item.Day</strong>
                            <p>@item.NianYue</p>
                        </div>
                        <div class="article-info">
                            <a href="/NewsDetail/Index/@item.Id">
                                <h3>@item.Title</h3>
                                <p class="ty">@item.Cont</p>
                            </a>
                        </div>
                    </li>

                }*@
        </ul>
        <div id="my_page"></div>
    </section>
</div>
<script>
    $(function () {
        var pageNum = 1;//默认是第一页
        var limit = 6;//默认每页显示多少条
        getData(pageNum, limit);//第1页，来到页面就请求

        function getData(pageNum, limit) {//只是定义了一个方法，并没有调用
            //一进页面就请求数据
            $.ajax({
                url: "/News/DelPage",
                type: "post",
                dataType: "json",
                data: {
                    page: pageNum,//当前页数
                    limit: limit,  //每页多少条
                    id: $("#typeId").val()
                },
                success: function (res) {
                    console.log(res);
                    //数据处理
                    if (res.success == true) {
                        //第一页数据请求过来了
                        var str = "";
                        for (var i = 0; i < res.data.length; i++) {
                            str += '<li><div class="article-date"><strong>'
                                + res.data[i].Day+
                                '</strong><p>'
                                + res.data[i].NianYue +
                                '</p></div><div class="article-info"><a href="/NewsDetail/Index/'
                                  + res.data[i].Id +
                                 '"><h3>'
                                    + res.data[i].Title +
                                 '</h3><article>'
                                    + res.data[i].Cont +
                            '</article></a></div></li>';
                        }
                        console.log(str);
                        $("#main_list").html(str);
                        // 调用分页插件
                        //分页
                        $("#my_page").sPage({
                            page: pageNum,//当前是第几页
                            total: res.count,//数据总条数
                            pageSize: limit,//每页多少条
                            fastForward: 0,//默认显示多少页
                            backFun: function (p) {
                                //点击回调
                                pageNum = p;//pageNum变成第2页。。。。
                                //请求第2页的数据
                                getData(pageNum, limit);
                            }
                        });
                    }


                }
            })
        }
    });



</script>